<template>
  <div class="defaultview">
    <!-- <h1>后台管理默认页</h1> -->
    <template v-if="flag">
      <manage-login @flagChange="flag_change"></manage-login>
    </template>
    <template v-else>
      <h2 class="hint">[{{ username }}]--欢迎回来</h2>
    </template>
    <el-dialog
      class="login_hint"
      title="登录提示"
      :visible.sync="centerDialogVisible"
      width="400px"
      center
    >
    <span>用户已登录，是否跳转管理页</span>
      <span slot="footer" class="dialog-footer">
        <el-button @click="centerDialogVisible = false">切换账号</el-button>
        <el-button type="primary" @click="login_confirm"
          >确 定</el-button
        >
      </span>
    </el-dialog>
  </div>
</template>

<script>
export default {
  name: "defaultView",
  data() {
    return {
      centerDialogVisible:false,//对话框的显隐
      flag: true,
      username: null,
    };
  },
  methods: {
    flag_change(data) {
      // console.log("登录这边data", data);
      this.flag = data.flag;
      this.username = data.username;
      this.$emit("login_isok",data)
    },
    login_confirm(){
      this.centerDialogVisible=false;
      // location.href="";
      this.$router.push({path:'/backStage/classlist'})
    },
  },
  components: {
    manageLogin: () => import("@/components/manageLogin.vue"),
  },
  /*挂载后 */
  mounted() {
    let userinfo = JSON.parse(localStorage.getItem("userinfo")) || "";
    if (userinfo) {
      this.centerDialogVisible=true;
    }
  },
};
</script>

<style scoped>
.explain {
  text-align: center;
  margin-top: 50px;
}
.defaultview {
  width: 100%;
  height: 90%;
  /* background-color: #ffff00; */
  position: relative;
  margin: 0 auto;
}
/*登录后的提示 */
.hint {
  padding: 50px;
}
/*验证是否有用户登录的对话框 */
.login_hint{
  top: 15%;
}
</style>